<!-- 统计分析 -->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" href="./css/font.css">
  <link rel="stylesheet" href="./css/xadmin.css">
  <script type="text/javascript" src="./js/jquery-2.1.0.js"></script>
  <script src="./lib/layui/layui.js" charset="utf-8"></script>
  <script type="text/javascript" src="./js/Global.js"></script>
  <style>
    .wrap {
      padding: 20px;
    }

    .select {
      height: 40px;
      padding: 20px 0;
      border-bottom: 1px solid #ccc;
      text-align: center;
    }

    .search {
      width: 200px;
      height: 38px;
      margin: 0 auto;
      display: inline-block;
      padding-top: 1px;

    }

    .layui-input {
      width: 200px;
    }

    .btn {
      display: inline-block;

    }
    .layui-form {
      display: inline-block;
      margin: 0;
      padding: 0;
      height: 24px;
    }
  </style>
</head>

<body>
  <div class="wrap">
    <div class="layui-row">
      <div class="search">
        <input class="layui-input ksdate" type="text" placeholder="开始日期">
      </div>
      <div class="layui-form">
        <div class="layui-form-item">
          <div class="layui-input-inline">
            <select lay-filter="datesel" name="quiz2">
              <option value="">请选时段</option>
              <option value="0">一季度</option>
              <option value="1">二季度</option>
              <option value="2">三季度</option>
              <option value="3">四季度</option>
              <option value="4">上半年</option>
              <option value="5">下半年</option>
              <option value="6">本年度</option>
              <option value="7">上年度</option>
            </select>
          </div>
        </div>
      </div>
      <div class="search">
        <input class="layui-input jsdate" type="text" placeholder="结束日期">
      </div>
      <div class="btn">
        <button class="layui-btn layui-btn-normal" onclick="chaxun()">查询</button>
      </div>
      <!-- <div class="search layui-form">
        <div class="layui-input-inline">
          <select name="interest" lay-filter="aihao" stlyle="height:36px;">
            <option value="0">上月</option>
            <option value="1" selected="">上半年</option>
            <option value="1" selected="">下半年</option>
            <option value="1" selected="">默认当月</option>
          </select>
        </div>
      </div> -->
      <div class="btn">
        <button class="systemsetup layui-btn layui-btn-sm">Excel</button>
      </div>
    </div>
    <!-- <div class="select">
      
    </div> -->
    <table id="table" lay-filter="table" class="layui-table">
      <thead id="head">
        <tr>
          <th>车辆数</th>
          <th rowspan="2">客户名称</th>
          <th rowspan="2">车辆牌号</th>
          <th colspan="3">正常</th>
          <th colspan="3">±10%内</th>
          <th colspan="3">±10%外</th>
          <th colspan="3">出险</th>
        </tr>
        <tr>
          <th class="nums"> 22</th>
          <th>数量</th>
          <th>时长</th>
          <th>%</th>
          <th>数量</th>
          <th>时长</th>
          <th>%</th>
          <th>数量</th>
          <th>时长</th>
          <th>%</th>
          <th>数量</th>
          <th>时长</th>
          <th>%</th>
        </tr>
      </thead>
      <tbody class="weblist">
      </tbody>
    </table>
  </div>
</body>
<script type="text/javascript">
  var date=new Date();
  var year=date.getFullYear();
  var month=date.getMonth()+1;
  date.setMonth(month);
  date.setDate(0);
  var date_all=date.getDate();//当月总天数
  console.log(date.getMonth()+1);
  console.log(date.getDate());
  $('.ksdate').val(year+'-'+month+'-'+'1');
  $('.jsdate').val(year+'-'+month+'-'+date_all);
</script>
<script>
  
  chaxun();
  function chaxun(){
    var starttime=$('.ksdate').val();
    var endtime=$('.jsdate').val();
    var code=loadUserInfo.customer.cusCode;
    console.log(starttime);
    console.log(endtime);
    console.log(code);
    $.ajax({
          url: `${API}/real/statistics?`,
          // dataType:'json',
          type: 'get',
          data:{
            startTime:starttime,
            endTime:endtime,
            code:code,
          },
          success: function (res) {
            let arr = res.data;
            console.log(res.data);
            let str = ''
            $('.nums').html(arr.length)
            $.each(arr,function (i,n) {
            str+=`<tr>
            <td>${n.carNumber}</td>
            <td>${n.name}</td>
            <td>${n.plate}</td>
            <td>${n.znumber}</td>
            <td>${n.zdate}</td>
            <td>${n.zproportion}</td>
            <td>${n.dnumber}</td>
            <td>${n.ddate}</td>
            <td>${n.dproportion}</td>
            <td>${n.cnumber}</td>
            <td>${n.cdate}</td>
            <td>${n.cproportion}</td>
            <td>${n.gnumber}</td>
            <td>${n.gdate}</td>
            <td>${n.gproportion}</td>

          </tr>`
            })
            $('.weblist').html(str)
          }
    })
  }
</script>

<script>
layui.use('form', function () {
        var form = layui.form
        form.on('select(datesel)', function (data) {
            let val = data.value
            let years = new Date().getFullYear()
            switch (val) {
                case '0':
                    $('.ksdate').val(`${years}-01-01`)
                    $('.jsdate').val(`${years}-03-31`)
                    break;
                case '1':
                    $('.ksdate').val(`${years}-04-01`)
                    $('.jsdate').val(`${years}-06-30`)
                    break;
                case '2':
                    $('.ksdate').val(`${years}-07-01`)
                    $('.jsdate').val(`${years}-09-30`)
                    break;
                case '3':
                    $('.ksdate').val(`${years}-10-01`)
                    $('.jsdate').val(`${years}-12-31`)
                    break;
                case '4':
                    $('.ksdate').val(`${years}-01-01`)
                    $('.jsdate').val(`${years}-06-30`)
                    break;
                case '5':
                    $('.ksdate').val(`${years}-07-01`)
                    $('.jsdate').val(`${years}-12-31`)
                    break;
                case '6':
                    $('.ksdate').val(`${years}-01-01`)
                    $('.jsdate').val(`${years}-12-31`)
                    break;
                case '7':
                    $('.ksdate').val(`${years - 1}-01-01`)
                    $('.jsdate').val(`${years - 1}-12-31`)
                    break;
            }
        });
    })
</script>

</html>